<style>

</style>

<template>

  <div class="dispose" style="width: 90%;">
    <h3 style="margin-top: 10px;margin-bottom: 10px"><i class="el-icon-document-copy" style="margin-right: 10px"></i>开店申请审核
    </h3>
    <div style="display: flex;height: 170px;padding: 0.5%;background-color: #EFF2FC">
      <div style="width: 29%;padding-left: 80px">
        <img v-show="settled.auditStatus==1"
             src="https://spyx-yy.oss-cn-beijing.aliyuncs.com/2024/11/01/%E5%BE%85%E5%AE%A1%E6%A0%B8" height="155px">
        <img v-show="settled.auditStatus==8"
             src="https://spyx-yy.oss-cn-beijing.aliyuncs.com/2024/11/07/%E5%AE%A1%E6%A0%B8%E9%80%9A%E8%BF%87"
             height="155px">
        <div v-show="settled.auditStatus==9" style="margin-top: 53px;margin-left: 40px">
          <font size="6px">审核未通过</font>
        </div>
      </div>
      <div style="width: 69%;padding-top: 15px">
        <div>
          <div style="display: grid;grid-template-columns: repeat(3, 1fr);height: 50px">
            <div>店铺ID：{{ settled.id }}</div>
            <div>主营/辅营：{{ settled.main }}/{{ settled.auxiliary }}</div>
            <div>来源：{{ settled.source }}</div>
          </div>
        </div>
        <div style="display: grid; grid-template-columns: repeat(3, 1fr);height: 50px">
          <div>店铺名称：{{ settled.name }}</div>
          <div>负责人：{{ settled.responsiblePerson }}</div>
          <div>最近提交时间：{{ settled.submissionTime }}</div>
        </div>
        <div style="display: grid; grid-template-columns: repeat(3, 1fr);height: 50px">
          <div>店铺类型：{{ settled.type }}</div>
          <div>联系手机号：{{ settled.tel }}</div>
        </div>
      </div>
    </div>


    <h4 style="margin-top: 20px">店铺信息</h4>
    <div style="display: flex;margin-top: 10px;width: 100%; ">
      <div style="width: 32%;padding-top: 20px;margin-right:10px;padding-left: 20px">
        <p style="margin-bottom: 30px">店铺名称：&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;{{ settled.name }}</p>
        <p style="margin-bottom: 30px">所在地：&nbsp;&nbsp;&nbsp;{{ settled.address }}</p>
        <p style="margin-bottom: 30px">详细地址：&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;{{ settled.detailed }}</p>
        <p style="margin-bottom: 30px">店铺门面图：&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
          <img :src="settled.facadeImg" width="200px">
        </p>
        <p style="margin-bottom: 30px">店铺环境图：&nbsp;&nbsp;&nbsp;
          <img :src="settled.environmentImg" width="200px">
        </p>
      </div>
    </div>

    <h4 style="margin-top: 20px">法人信息</h4>
    <div style="display: flex;margin-top: 10px;width: 100%; ">
      <div style="width: 32%;padding-top: 20px;margin-right:10px;padding-left: 20px">
        <p style="margin-bottom: 30px">法人姓名：&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;{{ settled.juridicalPerson }}</p>
        <p style="margin-bottom: 30px">性别：&nbsp;&nbsp;&nbsp;{{ settled.juridicalpersonSex }}</p>
        <p style="margin-bottom: 30px">证件类型：&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;{{ settled.juridicalpersonType }}</p>
        <p style="margin-bottom: 30px">证件有效期：&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;{{ settled.juridicalpersonYtime }}</p>
        <p style="margin-bottom: 30px">证件正面图：&nbsp;&nbsp;&nbsp;
          <img :src="settled.juridicalpersonZimg" width="200px">
        </p>
        <p style="margin-bottom: 30px">证件背面图：&nbsp;&nbsp;&nbsp;
          <img :src="settled.juridicalpersonBimg" width="200px">
        </p>
      </div>
    </div>


    <h4 style="margin-top: 20px">营业执照</h4>
    <div style="display: flex;margin-top: 10px;width: 100%; ">
      <div style="width: 32%;padding-top: 20px;margin-right:10px;padding-left: 20px">
        <p style="margin-bottom: 30px">证件编号：&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;{{ settled.businessLicense }}</p>
        <p style="margin-bottom: 30px">证件有效期：&nbsp;&nbsp;&nbsp;{{ settled.businesslicenseYtime }}</p>
        <p style="margin-bottom: 30px">证件正面图：&nbsp;&nbsp;&nbsp;
          <img :src="settled.businesslicenseZimg" width="200px">
        </p>
      </div>
    </div>

    <h4 style="margin-top: 20px">经营许可证</h4>
    <div style="display: flex;margin-top: 10px;width: 100%; ">
      <div style="width: 32%;padding-top: 20px;margin-right:10px;padding-left: 20px">
        <p style="margin-bottom: 30px">证件编号：&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;{{ settled.licensing }}</p>
        <p style="margin-bottom: 30px">证件有效期：&nbsp;&nbsp;&nbsp;{{ settled.licensingYtime }}</p>
        <p style="margin-bottom: 30px">证件正面图：&nbsp;&nbsp;&nbsp;
          <img :src="settled.licensingZimg" width="200px">
        </p>
      </div>
    </div>


    <div>
      <el-card style="margin-top: 20px;border-color: white;box-shadow: none">
        <div slot="header" class="clearfizx">
          <span>审核意见</span>
        </div>
        <el-form v-show="settled.auditStatus==1" ref="form" :model="settled" label-width="120px">
          <el-form-item label="当前审核人：">
            <el-input v-model="user.username" style="width: 300px;" disabled></el-input>
          </el-form-item>
          <el-form-item label="审核结果：">
            <el-radio-group v-model="settled.reviewersOutcome">
              <el-radio label="同意">同意</el-radio>
              <el-radio label="拒绝">拒绝</el-radio>
            </el-radio-group>
          </el-form-item>
          <el-form-item v-if="settled.reviewersOutcome === '拒绝'" label="拒绝原因：">
            <el-select v-model="settled.refuse" placeholder="请选择原因">
              <el-option label="全部" value=""></el-option>
              <el-option label="原因1" value="1"></el-option>
              <el-option label="原因2" value="2"></el-option>
              <!-- 添加更多拒绝原因选项 -->
            </el-select>
          </el-form-item>
          <el-form-item label="补充说明：">
            <el-input style="width: 70%;" v-model="settled.reviewersSupplement"
                      placeholder="请输入补充说明"></el-input>
          </el-form-item>
          <el-form-item>
            <el-button type="primary" @click="submitForm">确定</el-button>
            <el-button @click="cancel">取消</el-button>
          </el-form-item>
        </el-form>

        <div v-show="settled2.auditStatus!=1" style="display: flex;margin-top: 10px;width: 100%; ">
          <div style="width: 32%;padding-top: 20px;margin-right:10px;padding-left: 20px">
            <p style="margin-bottom: 30px">审核进程：&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;{{ settled.auditStatus==1?'待审核':settled.auditStatus==8?"审核通过":"审核拒绝" }}</p>
            <p style="margin-bottom: 30px">提交时间：&nbsp;&nbsp;&nbsp;{{ settled.submissionTime }}</p>
            <p style="margin-bottom: 30px">审核人：&nbsp;&nbsp;&nbsp;{{ settled. reviewers}}</p>
            <p style="margin-bottom: 30px">审核结果：&nbsp;&nbsp;&nbsp;{{ settled.auditStatus==1?'待审核':settled.auditStatus==8?"审核通过":"审核拒绝" }}</p>
            <p style="margin-bottom: 30px">审核时间：&nbsp;&nbsp;&nbsp;{{ settled.reviewTime}}</p>
          </div>
        </div>
      </el-card>
    </div>

  </div>
</template>

<script>
export default {
  data() {
    return {
      user: {username: "张三"},
      settled: {},
      users: {},
      settled2:{},
    }
  },
  methods: {
    //   获取该商户的审核信息
    findAllSettled() {
      var item = localStorage.getItem("settled");
      this.settled2=JSON.parse(item);
      this.settled = JSON.parse(item);
    },

    //   取消的方法
    cancel() {
      this.$router.push({path: '/user'});
    },


    //   审核确定按钮
    submitForm() {
      if (this.settled.reviewersOutcome == "拒绝") {
        this.settled.auditStatus = 9;
        if(this.settled.refuse!=1&&this.settled.refuse!=2){
          this.$message({
            message: '请选择拒绝原因',
            type: 'warning'
          });
          return;
        }
      } else {
        this.settled.auditStatus = 8;
      }
      this.axios.post(`http://localhost:8000/xm-client/xm-settled/audit`,this.settled).then(res=>{
        if(res.data.code==200){
          this.$message({
            message: '审核成功',
            type: 'success'
          });
        }
        this.$router.push({path:'/shops'});
      })
    }


  },

  created() {
    this.findAllSettled();
  },
}

</script>
